<template>
	<div class="main">
		<pull-to :bottom-load-method="loadmore">
			<ul class="list">
				<li v-for="(item, index) in dataList" :key="index">
					{{ item }}
				</li>
			</ul>
		</pull-to>
	</div>
</template>

<script>
	import PullTo from 'vue-pull-to';
	export default {
		components: {
			PullTo
		},
		data() {
			return {
				dataList: [],
			}
		},
		methods: {
			loadmore(loaded) {
				setTimeout(() => {
					loaded('done');
				}, 1000);
			},
		}
	}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
	.main{
		width: 100%;
		height:100%;
	}
</style>
